<template>
    <view class="banner">
        <u-swiper :list="detail.picUrl" height="375" radius="0" @change="getCurrentNum" :autoplay="false" indicatorStyle="right: 20px">
            <template v-slot:indicator>
                <view class="box w-73 h-40 f ai-c jc-c">
                    <text class="fs-24 fw-600 text-color5">{{ currentNum + 1 }}/{{ detail.picUrl.length }}</text>
                </view>
            </template>
        </u-swiper>
    </view>
</template>
<script setup lang="ts">
import { ref, toRefs } from 'vue';
const props = defineProps({
    detail: {
        type: Object,
    },
});
const { detail } = toRefs(props);
const currentNum = ref(0);
const getCurrentNum = (e: any) => {
    currentNum.value = e.current;
};
</script>
<style lang="scss" scoped>
.banner {
    position: relative;
    .box {
        background: rgba(0, 0, 0, 0.4);
        border-radius: 20rpx;
    }
}
</style>
